<template>
  <base-paenl>
    <div slot="main" class="slot-main">
      <div v-for="(item, index) of dataList" :key="index">
        <div class="panel-second-row5">
          <div class="panel-row-title">
            {{ item.name }}
          </div>
          <div class="panel-row-main">
            <div class="panel-row-content">
              <div class="panel-row-content-value">
                <font class="panel-row-content-value-count">{{
                  item.bnlj
                }}</font>
                {{ item.name == "租赁房源核查" ? "套" : "个次" }}
              </div>
              <div class="panel-row-content-name">
                本年累计
              </div>
            </div>
            <div class="panel-row-content">
              <div class="panel-row-content-value">
                <font class="panel-row-content-value-count">{{
                  item.jdlj
                }}</font
                >{{ item.name == "租赁房源核查" ? "套" : "个次" }}
              </div>
              <div class="panel-row-content-name">
                季度累计
              </div>
            </div>
            <div class="panel-row-content">
              <div class="panel-row-content-value">
                <font class="panel-row-content-value-count">{{
                  item.bylj
                }}</font
                >{{ item.name == "租赁房源核查" ? "套" : "个次" }}
              </div>
              <div class="panel-row-content-name">
                本月累计
              </div>
            </div>
            <div class="panel-row-content">
              <div class="panel-row-content-value">
                <font class="panel-row-content-value-count">{{ item.jr }}</font
                >{{
                  item.name == "租赁房源核查"
                    ? "套"
                    : "个次"
                }}
              </div>
              <div class="panel-row-content-name">
                今日
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </base-paenl>
</template>

<script lang="ts">
import { Vue, Component } from "vue-property-decorator";
import BasePaenl from "./CBase.vue";
import exportVue from "@/assets/modules/exportVue";

@Component({
  name: "CTaskHouse",
  components: { BasePaenl }
})
export default class extends Vue {
  data: any = {};
  dataList: any = [];
  active = "";
  mounted() {
    const _this = this;
    exportVue.$on("initGrid", (item: any) => {
      _this.data = item;
      _this.dataList = _this.data.taskInfozl;
    });
  }
  handleClick(type: string) {
    this.active = type;
  }
}
</script>

<style lang="scss" scoped>
.slot-main {
  height: 235px;
  .panel-second-row5 {
    .panel-row-title {
      width: 448px;
      height: 17px;
      margin-bottom: 10px;
    }
    .panel-row-main {
      margin-bottom: 10px;
    }
    .panel-row-content {
      width: 108px;
      height: 52px;
    }
  }
}
</style>
